<template>
  <div class="visa-body">
    <!-- header部分 -->
    <nav-title title="审批链加签" />
    <div class="container clearfix">
      <div class="search clearfix">
        <img class="search-img" src="./images/user.png" alt="" @click="searchVisa">&nbsp;
        <input class="search-input" type="text" placeholder="请输入姓名关键字" v-model="searchText">
        <img class="search-img" src="./images/searchicon.png" alt="" @click="searchVisa">
      </div>
    </div>
    <div v-for="(visa,index) in visaList" class="visa-user" v-bind:key="'visa_' + index">
      <input type="checkbox" name="visaBox" :value="visa.emplid">
      <label class="name">{{visa.nameDisplay}}</label>
      <label>({{visa.deptDescr}})</label>
    </div>
    <div style="height:100px;width:100px">
      &nbsp;
    </div>
    <div class="visa-btn">
      <button @click="visaUser">加签</button>
    </div>
  </div>
</template>

<script>
import {
  getVisa,
  getCompensateApprove,
  getFormalApprove,
  getWastageApprove,
  getRecruitmentApproveDrft,
  perresultApproveApel,
  approveMobilize
} from '../../api/api'
import { json2Form } from '../../util/http'

export default {
  components: {},
  mounted() {
    this.params = this.$route.params
    console.error(this.params)
  },
  data() {
    return {
      searchText: '',
      visaList: [],

      //按钮点击的参数
      params: {}
    }
  },
  methods: {
    //获取加签人员列表
    searchVisa() {
      if (this.searchText == '') {
        this.$vux.alert.show({
          title: '警告',
          content: '请输入'
        })

        return
      }
      let qparams = {
        queryValue: this.searchText
      }
      getVisa(qparams)
        .then(res => {
          if (res && res.retCode == '000000') {
            this.visaList = res.retData
          }
        })
        .catch(res => {
          this.$vux.alert.show({
            title: '警告',
            content: '网络异常，请稍后重试'
          })
        })
    },
    visaUser() {
      let id = document.getElementsByName('visaBox')
      let value = []
      for (var i = 0; i < id.length; i++) {
        if (id[i].checked) value.push(id[i].value)
      }
      

      if (value == '') {
        this.$vux.alert.show({
          title: '警告',
          content: '请选择人员'
        })
        return
      }
      let approveFun = getCompensateApprove;
      switch(this.params.approveBizType){
        case "formal":
          approveFun = getFormalApprove
          break
        case "wastage":
          approveFun = getWastageApprove
          break
        case "mobilization":
          approveFun = approveMobilize
          break
        case "recruitment":
          approveFun = getRecruitmentApproveDrft
          break
        case "perresult":
          approveFun = perresultApproveApel
          break
        default:
          approveFun = getCompensateApprove
          break
      }
      this.params.addUserIds = value
      approveFun(json2Form(this.params))
        .then(res => {
          if (res && res.retCode === '000000') {
            let _this = this
            this.$vux.alert.show({
              title: '成功',
              content: '操作成功',
              onHide() {
                _this.$router.push({
                  name: _this.params.cLink ? _this.params.cLink : "todoList",
                  query: {
                    cTransactionNbr: _this.params.cTransactionNbr
                  }
                })
              }
            })
          } else {
            this.$vux.alert.show({
              title: '提示',
              content: res.retMsg
            })
          }
        })
        .catch(res => {
          this.$vux.alert.show({
            title: '警告',
            content: '网络异常，请稍后重试'
          })
        })
      }
  }
}
</script>

<style lang="scss" scoped>
.visa-body {
  height: 100%;
  /* background-color: #f2f2f2; */
  .search {
    text-align: left;
    .search-img {
      margin-left: 30px;
    }
    .search-input {
      width: 60%;
    }
  }
}
.container {
  background-color: #f2f2f2;
  margin-bottom: 20px;
  height: 40px;
  line-height: 40px;
}

.visa-user {
  padding: 10px 10px 10px 10px;
  margin: 0px 10px 10px 10px;
  text-align: left;
  background-color: #f2f2f2;
  border-radius: 4px;
}
.visa-user img {
  vertical-align: text-top;
}

.name {
  font-weight: bold;
}

.visa-btn {
  width: 100%;
  margin: 0 auto;
  color: #fff;
  position: fixed;
  bottom: 15px;
  text-align: center;
}

.visa-btn button {
  color: white;
  font-size: 16px;
  font-weight: 900;
  line-height: 40px;
  width: 250px;
  height: 40px;
  background-color: #1caafe;
  border-radius: 4px;
}
</style>
